<template>
	<view class="content">
        <u-navbar bgColor="#fff" :fixed="true" :shadow="true" :safeAreaInsetTop="true" :placeholder="true"
            leftIconColor="#151C24" title="项目详情" @leftClick="back">
        </u-navbar>

        <view class="uni-area">
            <view class="u-m-t-30 uni-shadow">
                <text class="u-font-32 font-bold">项目定位</text>
                <map ref="map" id="map" class="u-m-t-30 map" 
                    :latitude="map.giswd" :longitude="map.gisjd" :scale="14" :markers="map.covers">
                </map>
            </view>

            <!-- 项目信息 -->
            <uni-item-base class="u-m-t-30" :baseData="projectData" />

            <!--单位信息 -->
            <view class="u-m-t-30 uni-shadow unit">
                <view class="u-m-b-20 u-font-32 font-bold">单位信息</view>
                <u-scroll-list :indicator="false" class="u-p-b-0">
                    <view v-for="(item, index) in tab" :key="index" @click="current=index"
                        :class="['u-m-r-50','u-p-t-20','u-p-b-20','u-font-28','font-bold',index==current?'uni-higt-color':'uni-dec-color']">
                        <text style="white-space:nowrap">{{item}}</text>
                    </view>
                </u-scroll-list>

                <swiper :current="current" :disable-touch="true" :touchable="true" 
                    class="u-m-t-20 swiper"  style="min-height:242rpx; height:auto !important">

                    <swiper-item v-for="(item, index) in tab" :key="index">
                        <!-- 其它单位 -->
                        <view class="swiper-item" v-if="tabListShow&&item!='分包单位'">
                            <view class="u-p-40 u-p-l-30 u-p-r-30 unit-box" @tap="unitDetail('unit',tabList[current].id)">
                                <view class="u-font-28 font-bold">
                                    {{tabList[current].name?tabList[current].name:'暂无单位相关数据'}}
                                </view>
                                <view class="u-m-t-24 u-flex u-font-24">
                                    <text class="u-m-r-16 uni-dec-color">负责人</text>
                                    <text>{{tabList[current].person?tabList[current].person:'暂无负责人数据'}}</text>
                                </view>
                                <view class="u-m-t-24 u-flex u-font-24">
                                    <text class="u-m-r-16 uni-dec-color">联系电话:</text>
                                    <uni-phone :phone="tabList[current].phone?tabList[current].phone:'暂无联系电话'" :size="12" />
                                </view>
                            </view>
                        </view>
                        <!-- 分包单位 -->
                        <view class="swiper-item swiper-item-1" v-if="tabListShow&&index==5">
                            <view v-for="(item1,index1) in tabList[index]" :key="index1"
                                class="u-m-t-30 u-p-40 u-p-l-30 u-p-r-30 unit-box" @tap="unitDetail('subUnit',item1.id)">
                                <view class="u-font-28 font-bold">
                                    {{item1.fbDwmc?item1.fbDwmc:'暂无单位相关数据'}}
                                </view>
                                <view class="u-m-t-24 u-flex u-font-24">
                                    <text class="u-m-r-16 uni-dec-color">负责人</text>
                                    <text>{{item1.buildingleader?item1.buildingleader:'暂无负责人数据'}}</text>
                                </view>
                                <view class="u-m-t-24 u-flex u-font-24">
                                    <text class="u-m-r-16 uni-dec-color">联系电话:</text>
                                    <uni-phone :phone="item1.buildingleaderphone?item1.buildingleaderphone:'暂无联系电话'" :size="12" />
                                </view>
                            </view>
                        </view>
                    </swiper-item>
                </swiper>
            </view>

            <!-- 人工费用拨付信息 -->
            <uni-item-base class="u-m-t-30" :baseData="rgfybfxxData" />

            <!-- 保证金专户信息 -->
            <uni-item-base class="u-m-t-30" :baseData="baozhengjinData" @temRightLook="bzjDetail" ></uni-item-base>
         
            <!-- 工资专户信息 -->
            <uni-item-base class="u-m-t-30" :baseData="gongziData" @temRightLook="wageDetail('/pages/fohf-bag/detail?id='+gongziData.id)"/>
           
            <!-- 班组统计 -->
            <uni-item-base class="u-m-t-30" :baseData="banzuData" @temRightLook="skip('/pages/team-bag/manage?gcbh='+gcbh)" />
          
            <!-- 附件 -->
            <uni-accessory class="u-m-t-30" :accessorys="accessoryList"></uni-accessory>
        </view>

        <!-- 提示组件 -->
        <u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	export default {
		data() {
			return {
                gcbh: null,
                map:{
                    giswd: 30.549958, // 纬度
                    gisjd: 104.090303, // 经度
                    covers: [
                        {
                            id: 1,
                            latitude: 30.549958, 
                            longitude: 104.090303,
                            iconPath: '/static/map.png',
                            width: 30,
                            height: 36,
                            callout:{
                                content: '新疆',
                                color: '#363635',
                                fontSize: 13,
                                borderRadius: 4,
                                bgColor: '#fff',
                                padding: 6,
                                display: 'ALWAYS'// 常显
                            },
                        }
                    ],
                },
                // 项目信息
                projectData:{
                    line: false,
                    title: '项目信息',
                    list:[
                        // 原数据 据(基础信息优化工作20220326_APP优化)文档修改
                        // { field:'xmmc', title:'项目全称', value:'加载中' },
                        // { field:'xmtype', title:'项目类型', value:'加载中' },
                        // { field:'contactName', title:'项目经理', value:'加载中' },
                        // { field:'jsjd', title:'工程进度', value:'加载中' },
                        // { field:'contactPhone', title:'联系电话', value:'加载中', type:'phone' },
                        // { field:'district_name', title:'项目属地', value:'加载中' },
                        // { field:'jhkgsj', title:'开工日期', value:'加载中' },
                        // { field:'jhjgsj', title:'完工日期', value:'加载中' },
                        { field:'xmmc', title:'项目名称', value:'安薪乐' },
                        { field:'xmtype', title:'行业主管部门', value:'安薪乐' },
                        { field:'tzlx', title:'项目种类', value:'安薪乐' },
                        { field:'jsjd', title:'工程进度', value:'安薪乐' },
                        { field:'districtName', title:'所属兵团辖区', value:'安薪乐' },
                        { field:'constructionxmjlname', title:'项目经理', value:'安薪乐' },
                        { field:'constructionxmjllxdh', title:'项目经理联系电话', value:'安薪乐', type:'phone' },
                        { field:'jhkgsj', title:'合同开工日期', value:'安薪乐' },
                        { field:'jhjgsj', title:'合同竣工日期', value:'安薪乐' },
                        { field:'ztz', title:'中标合同价格(工程造价)', value:'安薪乐',unit:'万元' },
                    ]
                },
                // 单位信息tab
                tab:['建设单位', '勘察单位', '总包单位','监理单位','设计单位'], // 分包单位
                tabListShow: false,
                tabList:[],
                current: 0,
                // 人工费用拨付信息
                rgfybfxxData:{
                    line: false,
                    title: '人工费用拨付信息',
                    list:[
                        { field:'rgfyydht', title:'人工费用约定合同/协议', value:'安薪乐' },
                        { field:'rgfy', title:'人工费用', value:'安薪乐', unit:'万元' },
                        { field:'rgfybl', title:'人工费用占工程款比例', value:'安薪乐',unit:'%' },
                        { field:'rgfbfzq', title:'人工费拨付周期', value:'安薪乐', unit:'月' },
                        { field:'bfrq', title:'每月拨付日', value:'安薪乐', unit:'日' },
                        { field:'bffs', title:'拨付方式', value:'安薪乐' },
                    ]
                },
                // 保证金专户信息
                baozhengjinData:{
                    line: false,
                    title: '保证金专户信息',
                    rightText: '查看',
                    list:[
                        { field:'bailtype', title:'保证金缴纳类型', value:'加载中' },
                        { field:'account', title:'专户账号/函号', value:'加载中' },
                        { field:'banktype', title:'开户银行', value:'加载中' },
                        { field:'balance', title:'账户余额/保函金额', value:'0', unit:'万元' },
                    ]
                },
                // 工资专户信息
                gongziData:{
                    line: false,
                    title: '工资专户信息',
                    rightText: '查看',
                    list:[
                        { field:'zhname', title:'专户名称', value:'暂无数据源', },
                        { field:'zhmc', title:'专户账号', value:'暂无数据源', },
                        { field:'khh', title:'开户银行', value:'暂无数据源', },
                        { field:'zhyeNew', title:'账户余额', value:0, unit:'万元' },
                    ]
                },
                // 班组统计
                banzuData:{
                    line: false,
                    title: '班组统计',
                    rightText: '查看',
                    list:[
                        { title:'班组数量', value: 0, unit:'个' },
                        { title:'班组总人数', value: 0, unit:'人' },
                    ]
                },
                // 附件
                accessoryList:[],
			}
		},

		onLoad(option) {
            this.gcbh = option.id
            // 获取项目详情(单位信息在该接口里面)
            this.getPorjectDetail(option.id)
            // 保证金专户信息
            this.getProAccsBail(option.id)
            // 工资专户
            this.getProWageInfo(option.id)
            // 班组统计
            this.getProTeamInfo(option.id)
            // 附件
            this.getProAccessory(option.id)
		},

		methods: {
            // 返回
            back(){
                uni.navigateBack()
            },
            // 跳转
            skip(url){
                uni.navigateTo({ url:url})
            },

            // 保证金详情
            bzjDetail(){
                // uni.$u.toast('无保证金Id')
                uni.$u.toast('暂无数据源')
                return false
                uni.navigateTo({ url:'/pages/fohf-bag/bzjDetail?id=1&type=0'})
            },
            // 专户工资信息查看详情
            wageDetail(url){
                if( this.gongziData.id ){
                    uni.navigateTo({ url:url})
                }else{
                    uni.$u.toast('未设立工资专户')
                }
            },

            
            // 项目详情
            getPorjectDetail(id){
                const api = JSON.parse(JSON.stringify(this.$apis.proProjectDetail))
                api.url = api.url+'/'+id
                this.$request(this,api,{}).then(res=>{
                    console.log('项目详情',res)
                    
                    // 地图数据
                    this.map.giswd = res.giswd
                    this.map.gisjd = res.gisjd
                    this.map.covers[0].latitude = res.giswd
                    this.map.covers[0].longitude = res.gisjd
                    this.map.covers[0].longitude = res.gisjd
                    this.map.covers[0].callout.content = this.$tools.transTwoArry(res.xmmc,20).join(',')

                    // 项目信息
                    this.projectData.list.map((v,i)=>{
                        v.value = res[v.field]||res[v.field]==0?res[v.field]:'暂无数据源'
                    })
                    
                    // 人工费用拨付信息
                    this.rgfybfxxData.list.map((v,i)=>{
                        v.value = res[v.field]||res[v.field]==0?res[v.field]:'暂无数据源'
                    })

                    // 单位信息
                    this.tab.map((v,i)=>{
                        this.tabList.push({
                            id: null, name: '暂无数据', person: '暂无数据', phone: '10086'
                        })
                    })
                    // 建设单位
                    this.tabList[0].id = res.buildingid
                    this.tabList[0].name = res.buildingname
                    this.tabList[0].person = res.buildingleader
                    this.tabList[0].phone = res.buildingleaderphone
                    // 勘查单位
                    this.tabList[1].id = res.prospectingid
                    this.tabList[1].name = res.prospectingname
                    this.tabList[1].person = res.prospectingleader
                    this.tabList[1].phone = res.prospectingleaderphone
                    // 总包单位（施工单位）
                    this.tabList[2].id = res.constructionid
                    this.tabList[2].name = res.constructionname
                    this.tabList[2].person = res.constructionleader
                    this.tabList[2].phone = res.constructionleaderphone
                    // 监理单位
                    this.tabList[3].id = res.supervisionid
                    this.tabList[3].name = res.supervisionname
                    this.tabList[3].person = res.supervisionleader
                    this.tabList[3].phone = res.supervisionleaderphone
                    // 设计单位
                    this.tabList[4].id = res.designid
                    this.tabList[4].name = res.designname
                    this.tabList[4].person = res.designleader
                    this.tabList[4].phone = res.designleaderphone

                    this.tabListShow = true

                    // 先获取分包单位列表,判断是否有分包单位
                    this.$request(this,this.$apis.proProjectSubs,{gcbh:id}).then(res=>{
                        // console.log('分包单位',res)
                        if( res.total && res.total != 0 ){
                            this.tab.push('分包单位')
                            this.tabList[5] = res.data
                            // "id": "gcxx_fb_21120815572100000013",		// 分包业务编号
                            // "fbDwmc": "广厦物业建筑公司",				// 分包单位名称
                            // "buildingleader": "申屠卿朋",				// 项目负责人
                            // "buildingleaderphone": "18997933177",      // 负责人联系电话
                        }
                    })
                }).then()
            },


            // 查看单位详情(分包单位和其它单位)
            unitDetail(type,id){
                if( id ){
                    uni.navigateTo({ url: '/pages/unit-bag/detail?id='+id+'&type='+type })
                }else{
                    uni.$u.toast('暂无数据源')
                    // uni.$u.toast('当前单位Id为空')
                    // uni.navigateTo({ url: '/pages/unit-bag/detail?id=&type='+type })
                }
            },



            // 保证金专户信息
            getProAccsBail(gcbh){
                this.$request(this,this.$apis.proAccsBail,{gcbh:gcbh}).then(res=>{
                    // console.log('保证金专户信息',res)
                    this.baozhengjinData.list.map((v,i)=>{
                        v.value = res[v.field]
                    })
                }).then()
            },

            // 工资专户信息
            getProWageInfo(gcbh){
                this.$request(this,this.$apis.proWageInfo,{gcbh:gcbh}).then(res=>{
                    // console.log('工资专户信息',res)
                    this.gongziData['id'] = res.id
                    this.gongziData.list.map((v,i)=>{
                        v.value = res[v.field]
                    })
                }).then()
            },

            // 班组统计
            getProTeamInfo(gcbh){
                this.$request(this,this.$apis.proTeamInfo,{gcbh:gcbh}).then(res=>{
                    console.log('班组统计',res)
                    this.banzuData.list[0].value = res.groups
                    this.banzuData.list[1].value = res.staffs
                }).then()
            },

            // 附件
            getProAccessory(ywbh){
                uni.showLoading({ title:'附件信息加载中' }) 
                const parameter = {
                    ywlx: 'salary_xmgl_xmdtgc', // 业务类型【必传】
                    ywbh: ywbh, // 业务编号【必传】
                }
                this.$request(this, this.$apis.CommonFjList, parameter).then(res=>{
                    // console.log('项目附件',res)
                    this.accessoryList = res
                }).then() 
            }
		}
	}
</script>

<style scoped lang="scss">
    .content{
        .map{
            width: 100%;
            height: 400rpx;
        }
        // 单位信息
        .unit{
            .uni-higt-color{
                position: relative;
                &:after{
                    content: '';
                    width: 60rpx;
                    height: 8rpx;
                    background: $uni-higt-error;
                    opacity: 1;
                    border-radius: 4rpx;
                    position: absolute;
                    left: 50%;
                    margin-left: -30rpx;
                    bottom: 0;
                }
            }
            .unit-box{
                background: #F2F2F5;
                border-radius: 10rpx;
            }
            .swiper-item-1{
                .unit-box:first-child{
                    margin-top: 0 !important;
                }
            }
        }
        /deep/.uni-swiper-wrapper{
            min-height: 242rpx !important;
        }
    }
</style>
